<template>
  <div class="pli">
    <div  v-for="(item,index) in tabledata" :key="index">
      <table>
        <tr>
          <td class="yunis">
            <h2>订单提交成功！去付款咯~</h2>
            <span><el-button class="types" type="success" icon="el-icon-check" circle></el-button></span>
            <span>请在30分内完成支付, 超时后将取消订单</span>
            <br />
            <h6>
              <span
                >收货信息：
                    {{item.ReceName}}
                    {{item.IndentNumber}}
              </span>
            </h6>
          </td>
          <td class="sssa">
            <div>
              <h2>应付金额：<span class="ssas">{{item.IndentSum}}</span>元</h2>
            </div>
          </td>
        </tr>
      </table>
          <input
      type="text"
      class="abc"
      style="border: 0px; border-bottom: 1px solid"
    />
    <h2 style="float: left">订单详情</h2>
    <br>
    <br>
    <br>
    <table>
      <tr>
        <td>
          <div class="sssw">
            <p>订单号：</p>
          </div>
          <br>
          <div class="sssw">
            <p>收货信息：      
                {{item.ReceName}}
                    {{item.IndentNumber}}          
              </p>
          </div>
          <br>
          <div class="sssw" >
            <p>商品名称：
                <img :src="item.GoodImg" width="50px" height="50px" alt="">
                {{item.GoodName}}
            </p>
          </div>
        </td>
      </tr>
      <tr>
        <td>
          <div class="sssw">发票信息:电子发票 个人</div>
        </td>
      </tr>
      <tr>
          <td>
              <button @click="tozfb">支付宝支付</button>
          </td>
      </tr>
    </table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
        tabledata:{
            InId:'',
            IndentNumber:'',
            GoodId:'',
            ReceId:'',
            CreateTime:'',
            ReceName:'',
            IndentSum:'',
            GoodName:'',
            GoodImg:'',
            IndentGooder:''
        }
    };
  },
  methods: {
      Getind(){
          this.$axios({
              url:'http://localhost:13443/api/Goods/DDTJ',
              method:'get'
          }).then(res=>{
              console.log(res.data)
              this.tabledata=res.data;
          })
      },
      tozfb(){
          this.$router.push('/zf')
      }
  },
   created() {
       this.Getind();
  },
};
</script>

<style>
.pli{
  width: 1500px;
}
.sssa{
  float: right;
  transform: translateX(500px);
}
.ssas{
  color:red;
}
.yunis{
  float: left;
  transform: translateX(200px); 
}
.types{
  transform: translateX(-100px);
}
.sssw{
  float: left;
  transform: translateX(-100px); 
}
</style>